<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="../js/vue.js"></script>
    </head>
    <body>
        <div id="container">
              <template v-if="goods.length>0">
                  <div v-for="good in goods" >
                      商品名: {{good.name}}    <br>
                      价格: {{good.price}}   <br>
                      数量:  {{good.num}}  <br>
                      <hr>
                  </div>
              </template>
              <div v-else >暂无商品</div>
        </div>
        <script>
         var app=  new Vue({
               el:"#container",
               data:{
                  goods:[{
                      name:"化为手机",
                      price:2999,
                      num:23
                  }]
               }
           });
        </script>
    </body>
</html>
